<template>
  <div>
    <div  style="height: 50px">
      <form>
        <div style="float: left;margin-left: 20px">
          关键字搜索:
          <el-input style="width: auto"   v-model="account"  size="small" placeholder="请输入内容"></el-input>
        </div>
        <div>
          <el-button icon="el-icon-search" circle style="margin-left: 8px" @click="goAddArticle()"></el-button>
          <!--                    <el-button type="primary" size="small" style="margin-left: 30px" @click="search()">搜索</el-button>-->
        </div>
      </form>
    </div>
    <hr>

    <div>
      <el-button type="primary" plain style="float: right;margin-left: 30px" size="small" v-on:click="back()">返回</el-button>
    </div>
    <div>
      <el-table
          :data="tableData"
          style="width: 100%">
        <el-table-column
            label="文章标题"
            prop="title">
        </el-table-column>
        <el-table-column
            label="发布人"
            prop="aName">
        </el-table-column>
        <el-table-column
            label="发布时间"
            prop="publishData">
        </el-table-column>
        <el-table-column
            fixed="right"
            label="操作"
            width="200">
          <template slot-scope="scope">
            <el-button @click="viewById(scope.row)" type="text" size="small">查看</el-button>
            <el-button @click="deleteById(scope.row)" type="text" size="small">删除</el-button>
          </template>
        </el-table-column>
      </el-table>


    </div>
  </div>
</template>
<script>

import axios from 'axios'
export default {
  name: "ArticleList",
  data(){
    return{
      account:'',
      tableData: null
    }
  },
  created(){
    this.account =sessionStorage.getItem('sno')
    var _this = this
    axios.get('http://localhost:8080/jas/sport/article/getMyArticle/'+_this.account).then(function (resp) {
      console.log(resp.data)
      _this.tableData = resp.data
    })
  },

  methods: {

    goAddArticle(){
      this.$router.push('/StudentMainPage/ArticleListMain')
    },

    back(){
      this.$router.push('/StudentMainPage/ArticleList')
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
      // console.log(val)
    },
    //table中的
    // mypage (currentpage) {
    //   const _this = this
    //   axios.get('http://localhost:8080/jas/sport/article/getAllArticle').then(function (resp) {
    //     _this.tableData = resp.data
    //   })
    // },

      viewById(row){
        this.$router.push(
            {
              name:'ViewMyArticleDetail',
              params:{
                aId:row.aId,           //文章id
                title:row.title,       //文章题目
                content:row.aContent,  //文章内容
                pubulisher:row.aName,  //发布人名字
                time:row.publishData,  //日期
              }})
    },
    deleteById(row){
      axios.get('http://localhost:8080/jas/sport/article/deleteArticle/'+row.aId).then(function (resp) {

      // this.$router.push({name:'ViewNoticeDetail',params:{noticeId:row.id}})
      })
      location.reload();
    },


    deleteByIds(row){
      var de;
      var _this = this;
      this.$confirm('此操作将永久删除该记录, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        var  that = this
        axios.get('http://localhost:8080/jas/mport/notice/deleteNoticeById/'+ row.id).then(function (resp) {
          if (resp.data =='success'){
            // alert('删除成功')
            location.reload();
          }
        });
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },





  }
}
</script>



<style lang="scss" scoped>
.demo-table-expand {
  font-size: 0;
}
.demo-table-expand label {
  width: 90px;
  color: #99a9bf;
}
.demo-table-expand .el-form-item {
  margin-right: 0;
  margin-bottom: 0;
  width: 50%;
}
</style>